// React基础组件
import React from 'react'
// dva 连接组件 - 连接route和model
import { connect } from 'dva'
// 引入antd的组件
import { Form, Radio, Button, Popconfirm, Modal, Row, Col, Input, Select, Cascader, Icon, Checkbox, Tabs, DatePicker, message, InputNumber } from 'antd'
//导入路由组件，用于跳转等
import { Link, hashHistory } from 'dva/router'
// 导入项目全局配置文件
import config from 'config/config'
// 引入model取值工具方法
import { mapStateToProps } from 'utils/view_utils'
// 当前组件样式
import styles from './competingGoodsDetailStyle.less'
import { CollapsiblePanels } from 'widget/CollapsiblePanels/index'
import { Grid, QueryCondition } from 'widget/Grid'
import FlagBtn from 'widget/FlagBtn/FlagView'
import moment from 'moment';
import { AdvanceSearch } from 'widget/CollapsiblePanels/index'
import Uploader from 'widget/Upload'
import PredictMap from 'widget/PredictMap/PredictMap'
import $ from 'jquery'
import download from 'downloadjs'

const FormItem = Form.Item
const { RangePicker } = DatePicker
const { Option } = Select;
const { Search } = Input;
const { TextArea } = Input;
/**
 * description 路由视图及事件处理
 * dispatch 分发到models中的effects对应事件名
 * model 用于获取models中state定义的数据
 * form 表单对象
 */
const competingGoodsDetailView = function ({ dispatch, model, form }) {
  // 表单的子函数
  const { resetFields, getFieldDecorator, validateFields, setFieldsValue, validateFieldsAndScroll } = form
  // 取出model对象，命名空间
  const { modelObj, namespace } = model
  let { mapListShow, mapList, url, imgModal, mapVisible, newProduct, selectedProject, latAndLon, address,
    productList, productId, brandNameModal, productTypeList, attributeList, goods, totalTableData, queryList,
    suitableDataList, pageConfig, pModalObj, tableData, keys, tableObj, query, actionType, btnLoading,
    loading, competitorOpeningQuotationList, parentCode, competitorOpeningQuotationItem, downId } = modelObj

  const formItemLayoutPro = {
    labelCol: { span: 6 },
    wrapperCol: { span: 14 },
  };
  mapList = localStorage.qianceMapList ? JSON.parse(localStorage.qianceMapList) : []
  //查询
  const onSearch = (payload) => {
    dispatch({
      type: `${namespace}/search`,
      payload: payload
    })
  }
  const columns = [
    {
      title: () => (
        <span>
          {'产品类型'}
          <span style={{ color: 'red' }}>*</span>
        </span>
      ), dataIndex: 'productType', key: 'productType', width: 200,
      render: function (value, item, index) {
        return (<div key={index}>
          <FormItem style={{ marginBottom: 0 }}>
            {getFieldDecorator(`productType_${index}`, {
              rules: [{
                required: true, whitespace: true, message: '请选择产品类型'
              }],
              initialValue: item.productType,
            })(
              <Select disabled={actionType == 'check'} placeholder="请选择" onChange={(e) => { tableChange(e, 'productType', item.key) }}>
                {productTypeList == undefined ? null : productTypeList.map((item) => {
                  return <Select.Option key={item.proName} value={item.proName}>{item.proName}</Select.Option>
                })}
              </Select>
            )}
          </FormItem>
        </div>)
      }
    },
    {
      title: '毛坯/装修', dataIndex: 'houseStaus', key: 'houseStaus', width: 200,
      render: function (value, item, index) {
        return (<div key={index}>
          <Select value={item.houseStaus} disabled={actionType == 'check'} placeholder="请选择" onChange={(e) => { tableChange(e, 'houseStaus', item.key) }}>
            <Select.Option value="毛坯">毛坯</Select.Option>
            <Select.Option value="装修">装修</Select.Option>
          </Select>
        </div>)
      }
    },
    {
      title: '产品户型', dataIndex: 'productHouseType', key: 'productHouseType', width: 260,
      render: function (value, item, index) {
        // return <div key={index}>
        //           <Input key={index} value = {item.productHouseType}  disabled={actionType == 'check'}
        //               onChange={(e) => { tableChange(e.target.value, 'productHouseType',item.key) }}
        //           />
        //       </div>
        return (<div>
          <Select value={item.productHouseType} disabled={actionType == 'check'} placeholder="请选择" onChange={(e) => { tableChange(e, 'productHouseType', item.key) }}>
            <Select.Option value="1房1厅1卫">1房1厅1卫</Select.Option>
            <Select.Option value="2房1厅1卫">2房1厅1卫</Select.Option>
            <Select.Option value="2房2厅1卫">2房2厅1卫</Select.Option>
            <Select.Option value="3房2厅1卫">3房2厅1卫</Select.Option>
            <Select.Option value="3房2厅2卫">3房2厅2卫</Select.Option>
            <Select.Option value="4房2厅1卫">4房2厅1卫</Select.Option>
            <Select.Option value="4房2厅2卫">4房2厅2卫</Select.Option>
            <Select.Option value="4房2厅3卫">4房2厅3卫</Select.Option>
            <Select.Option value="5房2厅3卫">5房2厅3卫</Select.Option>
            <Select.Option value="5房2厅4卫">5房2厅4卫</Select.Option>
            <Select.Option value="6房2厅2卫">6房2厅2卫</Select.Option>
            <Select.Option value="6房2厅3卫">6房2厅3卫</Select.Option>
            <Select.Option value="7房2厅2卫">7房2厅2卫</Select.Option>
            <Select.Option value="7房2厅3卫">7房2厅3卫</Select.Option>
          </Select>
        </div>)
      }
    },
    {
      title: '面积(m²)', dataIndex: 'area', key: 'area', width: 200,
      render: function (value, item, index) {
        return <div key={index}>
          <Input key={index} value={item.area} disabled={actionType == 'check'}
            onChange={(e) => { tableChange(e.target.value.replace(/[^\-?\d.]/g, ''), 'area', item.key) }}
            onBlur={(e) => { areaChange(e.target.value.replace(/[^\-?\d.]/g, ''), 'area', item.key) }}
          />
        </div>
      }
    },
    {
      title: '面积段', dataIndex: 'areaInterval', key: 'areaInterval', width: 300,
      render: function (value, item, index) {
        return item.areaInterval
      }
    },
    {
      title: '总套数', dataIndex: 'houseAmount', key: 'houseAmount', width: 300,
      render: function (value, item, index) {
        return <div key={index}>
          <Input key={index} value={item.houseAmount} disabled={actionType == 'check'}
            onChange={(e) => { houseAmountChange(e.target.value.replace(/[^\-?\d.]/g, ''), 'houseAmount', item) }}
          />
        </div>
      }
    },
    {
      title: '户配比(%)', dataIndex: 'priceRatio', key: 'priceRatio', width: 200,
      render: function (value, item, index) {
        return item.priceRatio
      }
    },
    {
      title: '户型图',
      dataIndex: 'image',
      key: 'image',
      width: 200,
      render: function (value, item, index) {
        if (!item.image) {
          return (<div style={{ cursor: 'pointer', color: '#0877fd' }} onClick={() => fileClick()}>
            <span>上传</span>
            <input type="file" id="file" accept="image/*" style={{ display: 'none' }} onChange={(e) => dispatch({ type: `${namespace}/upload`, payload: { e: e, item } })} />
          </div>)
        }
        if (item.image) {
          return (<div>
            <span onClick={() => upimgCancel(item.image)} style={{ cursor: 'pointer', color: '#0877fd', marginRight: '20px' }}>预览</span>
            <span onClick={() => deleteFun(item)} style={{ cursor: 'pointer', color: '#0877fd' }}>删除</span>
          </div>)
        }
      }
    }
  ]
  const columns1 = [
    {
      title: '产品类型', dataIndex: 'productType', key: 'productType',
      render: function (value, item, index) {
        return item.productType
      }
    },
    {
      title: '毛坯/装修', dataIndex: 'houseStatus', key: 'houseStatus',
      render: function (value, item, index) {
        return item.houseStatus
      }
    },
    {
      title: '当前均价(元/m²)', dataIndex: 'averagePrice', key: 'averagePrice',
      render: function (value, item, index) {
        return item.averagePrice
      }
    },
    {
      title: '累计成交(套数)', dataIndex: 'numberOfTransactions', key: 'numberOfTransactions',
      render: function (value, item, index) {
        return item.numberOfTransactions
      }
    },
    {
      title: '合计总额(万元)', dataIndex: 'allPrice', key: 'allPrice',
      render: (value, item, index) => {
        const obj = {
          children: value,
          props: {}
        };
        if (index === 0) {
          obj.props.rowSpan = totalTableData.length;
          obj.children = <Input value={item.allPrice} disabled={true}
            onChange={(e) => { tableChange(e.target.value, 'allPrice', item.id) }}
          />
        } else {
          obj.props.rowSpan = 0;
        }
        return obj;
      }
    },
  ]
  const columns2 = [
    {
      title: '序号', dataIndex: 'ruleNo', key: 'ruleNo', width: 120,
      render: function (value, item, index) {
        return index + 1
      }
    },
    {
      title: '区域', dataIndex: 'areaName', key: 'areaName', width: 240,
      render: function (value, item, index) {
        return item.areaName
      }
    },
    {
      title: '项目名称', dataIndex: 'projectName', key: 'projectName', width: 240,
      render: function (value, item, index) {
        return item.projectName
      }
    },
    {
      title: '状态', dataIndex: 'state', key: 'state', width: 120,
      render: function (value, item, index) {
        if (item.state == 0) {
          return '未关联'
        } else if (item.state == 1) {
          return '已关联'
        } else {
          return ''
        }
      }
    },
    {
      title: '操作',
      dataIndex: 'Action',
      key: 'Action',
      width: 120,
      render: function (value, item, index) {
        return <div>
          <FlagBtn node={<a onClick={() => switchFun(item)}>{item.state == 1 ? '取消关联' : "关联"}</a>} btnId={''}> </FlagBtn>
        </div>
      }
    }
  ]
  const columns3 = [
    {
      title: '开盘时间', dataIndex: 'openingTime', key: 'openingTime', width: 260,
      render: function (value, item, index) {
        const obj = {
          children: value,
          props: {},
        };
        const arrResult = mergeCells(competitorOpeningQuotationList);
        for (let i = 0; i < arrResult[0].length; i++) {
          if (index === arrResult[1][i]) {
            obj.props.rowSpan = arrResult[0][i];
            obj.children =
              <FormItem>
                {getFieldDecorator(`openingTime${index}`, {
                  initialValue: item.openingTime ? moment(item.openingTime, 'YYYY-MM-DD') : null
                })(
                  <DatePicker disabled={actionType == 'check'} format="YYYY-MM-DD" onChange={(e, val) => { inputChange2(val, 'openingTime', index) }} />
                )}
              </FormItem>
          }
          if (index > arrResult[1][i] && index < arrResult[1][i + 1]) {
            obj.props.rowSpan = 0;
          }
        }
        return obj;
      }
    },
    {
      title: '开盘批次', dataIndex: 'openingPi', key: 'openingPi', width: 180,
      render: function (value, item, index) {
        const obj = {
          children: value,
          props: {},
        };
        const arrResult = mergeCells(competitorOpeningQuotationList);
        for (let i = 0; i < arrResult[0].length; i++) {
          if (index === arrResult[1][i]) {
            obj.props.rowSpan = arrResult[0][i];
            obj.children =
              <Select value={item.openingPi} disabled={actionType == 'check'} placeholder="请选择" onChange={(value) => inputChange2(value, 'openingPi', index)}>
                <Select.Option value="首次开盘">首次开盘</Select.Option>
                <Select.Option value="后续加推">后续加推</Select.Option>
              </Select>
          }
          if (index > arrResult[1][i] && index < arrResult[1][i + 1]) {
            obj.props.rowSpan = 0;
          }
        }
        return obj;
      }
    },
    {
      title: '开盘方式', dataIndex: 'openingMethod', key: 'openingMethod', width: 180,
      render: function (value, item, index) {
        const obj = {
          children: value,
          props: {},
        };
        const arrResult = mergeCells(competitorOpeningQuotationList);
        for (let i = 0; i < arrResult[0].length; i++) {
          if (index === arrResult[1][i]) {
            obj.props.rowSpan = arrResult[0][i];
            obj.children =
              <Select value={item.openingMethod} disabled={actionType == 'check'} placeholder="请选择" onChange={(value) => inputChange2(value, 'openingMethod', index)}>
                <Select.Option value="现场集中开盘">现场集中开盘</Select.Option>
                <Select.Option value="线上开盘">线上开盘</Select.Option>
                <Select.Option value="内部解筹">内部解筹</Select.Option>
                <Select.Option value="摇号">摇号</Select.Option>
              </Select>
          }
          if (index > arrResult[1][i] && index < arrResult[1][i + 1]) {
            obj.props.rowSpan = 0;
          }
        }
        return obj;
      }
    },
    {
      title: '产品类型', dataIndex: 'productType', key: 'productType', width: 180,
      render: function (value, item, index) {
        return (<div key={index}>
          <Select value={item.productType} disabled={actionType == 'check'} placeholder="请选择" onChange={(value) => inputChange2(value, 'productType', index)}>
            {productTypeList == undefined ? null : productTypeList.map((item) => {
              return <Select.Option key={item.proName} value={item.proName}>{item.proName}</Select.Option>
            })}
          </Select>
        </div>)
      }
    },
    {
      title: '产品户型', dataIndex: 'productHouseType', key: 'productHouseType', width: 180,
      render: function (value, item, index) {
        return (<div>
          <Select value={item.productHouseType} disabled={actionType == 'check'} placeholder="请选择" onChange={(value) => inputChange2(value, 'productHouseType', index)}>
            <Select.Option value="1房1厅1卫">1房1厅1卫</Select.Option>
            <Select.Option value="2房1厅1卫">2房1厅1卫</Select.Option>
            <Select.Option value="2房2厅1卫">2房2厅1卫</Select.Option>
            <Select.Option value="3房2厅1卫">3房2厅1卫</Select.Option>
            <Select.Option value="3房2厅2卫">3房2厅2卫</Select.Option>
            <Select.Option value="4房2厅1卫">4房2厅1卫</Select.Option>
            <Select.Option value="4房2厅2卫">4房2厅2卫</Select.Option>
            <Select.Option value="4房2厅3卫">4房2厅3卫</Select.Option>
            <Select.Option value="5房2厅3卫">5房2厅3卫</Select.Option>
            <Select.Option value="5房2厅4卫">5房2厅4卫</Select.Option>
            <Select.Option value="6房2厅2卫">6房2厅2卫</Select.Option>
            <Select.Option value="6房2厅3卫">6房2厅3卫</Select.Option>
            <Select.Option value="7房2厅2卫">7房2厅2卫</Select.Option>
            <Select.Option value="7房2厅3卫">7房2厅3卫</Select.Option>
          </Select>
        </div>)
      }
    },
    {
      title: '面积(m²)', dataIndex: 'area', key: 'area', width: 140,
      render: function (value, item, index) {
        return <FormItem style={{ marginBottom: 0 }}>
          {getFieldDecorator(`area${index}`, { initialValue: item.area, rules: [{ max: 10, message: '面积不能大于10位数字' }] })(
            <Input key={index} disabled={actionType == 'check'} onChange={(e) => inputChange2(e.target.value.replace(/[^\-?\d.]/g, ''), 'area', index)} />
          )}
        </FormItem>
      }
    },
    {
      title: '开盘价格(元/m²)', dataIndex: 'openingPrice', key: 'openingPrice', width: 180,
      render: function (value, item, index) {
        return <FormItem style={{ marginBottom: 0 }}>
          {getFieldDecorator(`openingPrice${index}`, { initialValue: item.openingPrice, rules: [{ max: 10, message: '开盘价格不能大于10位数字' }] })(
            <Input key={index} disabled={actionType == 'check'} onChange={(e) => inputChange2(e.target.value.replace(/[^\-?\d.]/g, ''), 'openingPrice', index)} />
          )}
        </FormItem>
      }
    },
    {
      title: '开盘优惠', dataIndex: 'openingOffer', key: 'openingOffer', width: 280,
      render: function (value, item, index) {
        const obj = {
          children: value,
          props: {},
        };
        const arrResult = mergeCells(competitorOpeningQuotationList);
        for (let i = 0; i < arrResult[0].length; i++) {
          if (index === arrResult[1][i]) {
            obj.props.rowSpan = arrResult[0][i];
            obj.children =
              <FormItem style={{ marginBottom: 0 }}>
                {getFieldDecorator(`openingOffer${index}`, { initialValue: item.openingOffer, rules: [{ max: 50, message: '总认筹数不能大于50位数字' }] })(
                  <TextArea rows={2}  key={index} disabled={actionType == 'check'} onChange={(e) => inputChange2(e.target.value, 'openingOffer', index)} />
                )}
              </FormItem>
          }
          if (index > arrResult[1][i] && index < arrResult[1][i + 1]) {
            obj.props.rowSpan = 0;
          }
        }
        return obj;
      }
    },
    {
      title: '总认筹数（套）', dataIndex: 'totalSubscription', key: 'totalSubscription', width: 180,
      render: function (value, item, index) {
        const obj = {
          children: value,
          props: {},
        };
        const arrResult = mergeCells(competitorOpeningQuotationList);
        for (let i = 0; i < arrResult[0].length; i++) {
          if (index === arrResult[1][i]) {
            obj.props.rowSpan = arrResult[0][i];
            obj.children =
              <FormItem style={{ marginBottom: 0 }}>
                {getFieldDecorator(`totalSubscription${index}`, { initialValue: item.totalSubscription, rules: [{ max: 10, message: '总认筹数不能大于10位数字' }] })(
                  <Input key={index} disabled={actionType == 'check'} onChange={(e) => inputChange2(e.target.value.replace(/[^\-?\d.]/g, ''), 'totalSubscription', index)} />
                )}
              </FormItem>
          }
          if (index > arrResult[1][i] && index < arrResult[1][i + 1]) {
            obj.props.rowSpan = 0;
          }
        }
        return obj;
      }
    },
    {
      title: '总货量（套）', dataIndex: 'totalVolume', key: 'totalVolume', width: 180,
      render: function (value, item, index) {
        const obj = {
          children: value,
          props: {},
        };
        const arrResult = mergeCells(competitorOpeningQuotationList);
        for (let i = 0; i < arrResult[0].length; i++) {
          if (index === arrResult[1][i]) {
            obj.props.rowSpan = arrResult[0][i];
            obj.children =
              <FormItem style={{ marginBottom: 0 }}>
                {getFieldDecorator(`totalVolume${index}`, { initialValue: item.totalVolume, rules: [{ max: 10, message: '总货量不能大于10位数字' }] })(
                  <Input key={index} disabled={actionType == 'check'} onChange={(e) => inputChange2(e.target.value.replace(/[^\-?\d.]/g, ''), 'totalVolume', index)} />
                )}
              </FormItem>

          }
          if (index > arrResult[1][i] && index < arrResult[1][i + 1]) {
            obj.props.rowSpan = 0;
          }
        }
        return obj;
      }
    },
    {
      title: '总货值（万元）', dataIndex: 'totalValue', key: 'totalValue', width: 180,
      render: function (value, item, index) {
        const obj = {
          children: value,
          props: {},
        };
        const arrResult = mergeCells(competitorOpeningQuotationList);
        for (let i = 0; i < arrResult[0].length; i++) {
          if (index === arrResult[1][i]) {
            obj.props.rowSpan = arrResult[0][i];
            obj.children =
              <FormItem style={{ marginBottom: 0 }}>
                {getFieldDecorator(`totalValue${index}`, { initialValue: item.totalValue, rules: [{ max: 10, message: '总货值不能大于10位数字' }] })(
                  <Input key={index} disabled={actionType == 'check'} onChange={(e) => inputChange2(e.target.value.replace(/[^\-?\d.]/g, ''), 'totalValue', index)} />
                )}
              </FormItem>
          }
          if (index > arrResult[1][i] && index < arrResult[1][i + 1]) {
            obj.props.rowSpan = 0;
          }
        }
        return obj;
      }
    },
    {
      title: '去化套数', dataIndex: 'removalSetNum', key: 'removalSetNum', width: 180,
      render: function (value, item, index) {
        const obj = {
          children: value,
          props: {},
        };
        const arrResult = mergeCells(competitorOpeningQuotationList);
        for (let i = 0; i < arrResult[0].length; i++) {
          if (index === arrResult[1][i]) {
            obj.props.rowSpan = arrResult[0][i];
            obj.children =
              <FormItem style={{ marginBottom: 0 }}>
                {getFieldDecorator(`removalSetNum${index}`, { initialValue: item.removalSetNum, rules: [{ max: 10, message: '去化套数不能大于10位数字' }] })(
                  <Input key={index} disabled={actionType == 'check'} onChange={(e) => inputChange2(e.target.value.replace(/[^\-?\d.]/g, ''), 'removalSetNum', index)} />
                )}
              </FormItem>
          }
          if (index > arrResult[1][i] && index < arrResult[1][i + 1]) {
            obj.props.rowSpan = 0;
          }
        }
        return obj;
      }
    },
    {
      title: '去化率', dataIndex: 'removalRate', key: 'removalRate', width: 180,
      render: function (value, item, index) {
        const obj = {
          children: value,
          props: {},
        };
        const arrResult = mergeCells(competitorOpeningQuotationList);
        for (let i = 0; i < arrResult[0].length; i++) {
          if (index === arrResult[1][i]) {
            obj.props.rowSpan = arrResult[0][i];
            obj.children =
              <Input key={index} value={item.removalRate} readOnly />
          }
          if (index > arrResult[1][i] && index < arrResult[1][i + 1]) {
            obj.props.rowSpan = 0;
          }
        }
        return obj;
      }
    },
    {
      title: '竞品开盘销情简析', dataIndex: 'competitorOpeningSalesAnalysis', key: 'competitorOpeningSalesAnalysis', width: 280,
      render: function (value, item, index) {
        const obj = {
          children: value,
          props: {},
        };
        const arrResult = mergeCells(competitorOpeningQuotationList);
        for (let i = 0; i < arrResult[0].length; i++) {
          if (index === arrResult[1][i]) {
            obj.props.rowSpan = arrResult[0][i];
            obj.children =
              <FormItem style={{ marginBottom: 0 }}>
                {getFieldDecorator(`competitorOpeningSalesAnalysis${index}`, { initialValue: item.competitorOpeningSalesAnalysis, rules: [{ max: 300, message: '竞品开盘销情简析不能大于300字符' }] })(
                  <TextArea rows={4} key={index} disabled={actionType == 'check'} onChange={(e) => inputChange2(e.target.value, 'competitorOpeningSalesAnalysis', index)} />
                )}
              </FormItem>
          }
          if (index > arrResult[1][i] && index < arrResult[1][i + 1]) {
            obj.props.rowSpan = 0;
          }
        }
        return obj;
      }
    },
    {
      title: '市场趋势判断', dataIndex: 'marketTrendJudgment', key: 'marketTrendJudgment', width: 280,
      render: function (value, item, index) {
        const obj = {
          children: value,
          props: {},
        };
        const arrResult = mergeCells(competitorOpeningQuotationList);
        for (let i = 0; i < arrResult[0].length; i++) {
          if (index === arrResult[1][i]) {
            obj.props.rowSpan = arrResult[0][i];
            obj.children =
              <FormItem style={{ marginBottom: 0 }}>
                {getFieldDecorator(`marketTrendJudgment${index}`, { initialValue: item.marketTrendJudgment, rules: [{ max: 300, message: '市场趋势判断不能大于300字符' }] })(
                  <TextArea rows={4} key={index} disabled={actionType == 'check'} onChange={(e) => inputChange2(e.target.value, 'marketTrendJudgment', index)} />
                )}
              </FormItem>

          }
          if (index > arrResult[1][i] && index < arrResult[1][i + 1]) {
            obj.props.rowSpan = 0;
          }
        }
        return obj;
      }
    },
  ]
  // 合并单元格
  function mergeCells(dataSource) {
    let objResult = {};
    let arr = [];
    let arr1 = [];
    let arr2 = [0];
    let arrResult = [];
    let len = 0;
    let typeResult = null;
    dataSource.map((val) => {
      for (let i in val) {
        if (i === 'parentCode') {
          typeResult = val[i];
        }
      }
      let objArray = objResult[typeResult] || [];
      objArray.push(val);
      objResult[typeResult] = objArray;
    });
    for (let i in objResult) {
      arr.push(objResult[i]);
    }
    arr.map((val, key) => {
      arr1.push(val.length);
      len += val.length;
      arr2.push(len);
    });
    arrResult[0] = arr1;
    arrResult[1] = arr2;
    return arrResult;
  }
  // 导出开盘竞品
  function downloadProps3(id) {
    let url = `${config.aheadPlan}admin/competitorOpeningQuotation/competitorOpeningQuotation/exportXlsByCompetingGoodsId?competingGoodsId=${id}`;
    window.open(url);
  }
  // 添加一级表格
  function addGridProps3() {
    let children = { ...competitorOpeningQuotationItem };
    let parentcode = ++parentCode;
    children.parentCode = parentcode;
    competitorOpeningQuotationList.push(children)
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { competitorOpeningQuotationList, parentCode: parentcode }
    })
  }
  // 添加二级表格
  function addGridProps3Child(data, record, index) {
    let children = { ...competitorOpeningQuotationItem };
    children.parentCode = data.parentCode;
    children.openingTime = data.openingTime;
    children.openingPi = data.openingPi;
    children.openingMethod = data.openingMethod;
    competitorOpeningQuotationList.splice(index + 1, 0, children)
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { competitorOpeningQuotationList }
    })
  }
  // 删除二级表格
  function deleteGridProps3Child(data, record, index) {
    competitorOpeningQuotationList.splice(index, 1);
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { competitorOpeningQuotationList }
    })
  }
  function inputChange2(value, type, i) {
    competitorOpeningQuotationList[i][type] = value;
    let parentCode = competitorOpeningQuotationList[i].parentCode;
    if (type == 'openingTime' || type == 'openingPi' || type == 'openingMethod') {
      for (let k = 0; k < competitorOpeningQuotationList.length; k++) {
        if (competitorOpeningQuotationList[k].parentCode === parentCode) {
          competitorOpeningQuotationList[k][type] = value;
        }
      }
    }
    if (competitorOpeningQuotationList[i].removalSetNum && competitorOpeningQuotationList[i].totalVolume) {
      competitorOpeningQuotationList[i].removalRate = (competitorOpeningQuotationList[i].removalSetNum / competitorOpeningQuotationList[i].totalVolume * 100).toFixed(0) + '%'
    }
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { competitorOpeningQuotationList }
    })
  }
  // 表格操作区域
  function addGridProps3Action() {
    return {
      title: '操作',
      key: 'operation',
      fixed: 'right',
      width: 120,
      render: (data, record, index) => {
        return (
          actionType == 'check' ? null :
            <span style={{ display: 'inline-block' }}>
              <FlagBtn node={<a onClick={() => { addGridProps3Child(data, record, index) }}>添加</a>} > </FlagBtn>
              <span style={{ margin: '0 10px' }}></span>
              <FlagBtn node={<a onClick={() => { deleteGridProps3Child(data, record, index) }}>删除</a>} > </FlagBtn>
            </span>
        )
      }
    }
  }
  // 表格配置------------开始
  const gridProps3 = {
    nameSpace: namespace,
    data: {
      columns: [].concat(columns3, addGridProps3Action()),
      pageConfig: {},
      tableData: { total: '', dataSource: competitorOpeningQuotationList },
      selectedRowKeys: '',
    },
    scroll: { x: '2800px' },
    paginationFlag: false,
    loading
  }
  const gridProps = {
    nameSpace: namespace,
    data: {
      columns: [].concat(columns, generateAction())
      ,//已发布的活动不能添加和删除时间段
      pageConfig: {},
      tableData: { total: '', dataSource: tableData },
      selectedRowKeys: '',
    },
    scroll: { x: '1800px' },
    paginationFlag: false,
    loading
  }
  const gridProps1 = {
    nameSpace: namespace,
    data: {
      columns: columns1
      ,//已发布的活动不能添加和删除时间段
      pageConfig: {},
      tableData: { total: '', dataSource: totalTableData },
      selectedRowKeys: '',
    },
    scroll: { x: '1000px' },
    paginationFlag: false,
    loading
  }

  const gridProps2 = {
    nameSpace: namespace,
    data: {
      columns: columns2,
      pageConfig: pageConfig, tableData: suitableDataList,
      selectedRowKeys: '',
    },
    pageChange: (pageNo, pageSize) => {
      suitableDataList.pageNo = pageNo
      suitableDataList.pageSize = pageSize
      pageConfig.pageNo = pageNo
      pageConfig.pageSize = pageSize
      tableData = suitableDataList
      pageConfig = pageConfig
      dispatch({
        type: `${namespace}/updateStore`,
        payload: { suitableDataList, pageConfig }
      })
    },
    scroll: { x: 800 },
    loading
  }

  // 表格操作区域
  function generateAction() {
    return {
      title: '操作',
      key: 'operation',
      fixed: 'right',
      width: 120,
      render: (data, record, index) => {
        return (
          actionType == 'check' ? null :
            <span style={{ display: 'inline-block' }}>
              <FlagBtn node={<a onClick={() => { deleteItem(data, record, index) }}>删除</a>} > </FlagBtn>
            </span>
        )
      }
    }
  }

  function fileClick() {
    $('#file').click()
  }
  // 预览图片
  function upimgCancel(imgurl) {
    imgModal.visible = !imgModal.visible
    url = imgurl
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { imgModal, url }
    })
  }
  // 删除图片
  function deleteFun(data) {
    for (var item of tableData) {
      if (item.key == data.key) {
        item.image = ''
      }
    }
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { tableData }
    })
    message.success('删除成功')
  }


  // 添加
  function addTableRow() {
    tableObj.key = ++keys
    let obj = JSON.parse(JSON.stringify(tableObj))
    tableData.push(obj)

    dispatch({
      type: `${namespace}/updateStore`,
      payload: { tableData, keys }
    })
  }

  //删除选中项
  function deleteItem(data, record) {
    let arr = tableData && tableData.length ? tableData.filter(item => item.key != data.key) : []
    tableData = arr
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { tableData }
    })
  }

  function switchFun(item) {
    for (var itemed of suitableDataList.dataSource) {
      if (itemed.projectId == item.projectId) {
        itemed.state == 1 ? itemed.state = 0 : itemed.state = 1
      }
    }
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { suitableDataList }
    });
  }

  //地图回调
  function cbk(res) {
    address = res.surroundingPois && res.surroundingPois.length ? res.address + res.surroundingPois[0].title : res.address
    // latAndLon = res.point
    latAndLon[0] = Number(res.point.lat)
    latAndLon[1] = Number(res.point.lng)
    query.lat = res.point.lat
    query.lng = res.point.lng
    for (var item of attributeList) {
      if (item.tableField == 'address') {
        item.defaultValue = address
      }
    }
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { address, latAndLon, query, attributeList }
    });
    form.resetFields()
  }
  function updateAddress(el) {
    address = el.address ? el.address : ''
    latAndLon[0] = Number(el.point.lat)
    latAndLon[1] = Number(el.point.lng)
    query.lat = el.point.lat
    query.lng = el.point.lng
    for (var item of attributeList) {
      if (item.tableField == 'address') {
        item.defaultValue = address
      }
    }
    mapListShow = false
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { query, address, attributeList, latAndLon, mapListShow }
    });
    form.resetFields()
  }


  //关联我司项目弹窗
  function updateProjectName(id) {
    productId = id
    pModalObj.visible = !pModalObj.visible
    let myProject = attributeList.filter(el => el.tableField == 'relationProject')
    let list = myProject[0].defaultValue.split(",")
    for (var itt of productList) {
      for (var item of list) {
        if (itt.projectId == item.split(":")[0]) {
          itt.state = 1
        }
      }
    }
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { pModalObj, productId, productList }
    })
  }
  function confirmBuyHouse() {
    let list = suitableDataList.dataSource.filter(el => el.state == 1)
    let arr = []
    let arr1 = []
    let arr2 = []
    for (var i = 0; i < list.length; i++) {
      let str = list[i].projectId + ':' + list[i].projectName
      arr.push(str)
      query.areaId = list[i].areaId
      query.areaName = list[i].areaName
      arr1.push(list[i].projectId)
      arr2.push(list[i].projectName)
    }
    query.projectId = arr1.join(',')
    query.projectName = arr2.join(',')
    for (var item of attributeList) {
      if (item.id == productId) {
        item.defaultValue = arr.join(',')
        item.title = arr.join(',')
        item.projectId = arr1.join(',')
        selectedProject = arr.join(',')
      }
      if (item.attributeName == "竞品周报录入授权项目") {
        item.itemContent = arr.join(',')
      }
    }
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { attributeList, query, selectedProject }
    })
    updateProjectName()
  }

  //地址搜索改变时
  function addressChange(value, name, id) {
    for (var item of attributeList) {
      if (item.id == id) {
        item.defaultValue = value
      }
    }
    mapList = []
    address = value
    mapVisible = true
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { attributeList, address, mapVisible }
    })
    setTimeout(() => {
      mapListShow = true
      dispatch({
        type: `${namespace}/updateStore`,
        payload: { mapListShow }
      })
    }, 1000);
  }
  //输入框改变时
  function inputChange(value, name, id) {
    for (var item of attributeList) {
      if (item.id == id) {
        item.defaultValue = value
      }
    }
    mapVisible = false
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { attributeList, mapVisible }
    })
  }
  //表格改变时
  function tableChange(value, name, id) {
    let obj = { [name]: value }
    for (var item of tableData) {
      if (item.key == id) {
        item = Object.assign(item, obj)
      }
    }
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { tableData }
    })
  }
  //套数改变时计算户配比
  function houseAmountChange(value, name, item) {
    let id = item.key ? item.key : ''
    let product = item.productType ? item.productType : ''
    let obj = { [name]: value }
    for (var item of tableData) {
      if (item.key == id) {
        item = Object.assign(item, obj)
      }
    }
    let list = tableData.filter(el => el.productType == product)
    if (list.length) {
      let allNum = getSum(list)
      for (var pp of tableData) {
        for (var tt of list) {
          if (pp.key == tt.key) {
            pp.priceRatio = (Number(pp.houseAmount) / allNum * 100).toFixed(2)
          }
        }
      }
    }
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { tableData }
    })
  }
  function getSum(array) {
    let sum = 0
    for (var i = 0; i < array.length; i++) {
      sum += parseInt(array[i].houseAmount);
    }
    return sum;
  }
  function areaChange(value, name, id) {
    let val = Number(value)
    if (val < 80) {
      for (var item of tableData) {
        if (item.key == id) {
          item.areaInterval = '80m²以下'
        }
      }
    }
    if (val > 80 && val <= 90) {
      for (var item of tableData) {
        if (item.key == id) {
          item.areaInterval = '80-90m²(含)'
        }
      }
    }
    if (val > 90 && val <= 100) {
      for (var item of tableData) {
        if (item.key == id) {
          item.areaInterval = '90-100m²(含)'
        }
      }
    }
    if (val > 100 && val <= 110) {
      for (var item of tableData) {
        if (item.key == id) {
          item.areaInterval = '100-110m²(含)'
        }
      }
    }
    if (val > 110 && val <= 120) {
      for (var item of tableData) {
        if (item.key == id) {
          item.areaInterval = '110-120m²(含)'
        }
      }
    }
    if (val > 120 && val < 144) {
      for (var item of tableData) {
        if (item.key == id) {
          item.areaInterval = '120-144m²'
        }
      }
    }
    if (val >= 144 && val <= 160) {
      for (var item of tableData) {
        if (item.key == id) {
          item.areaInterval = '144(含)-160m²(含)'
        }
      }
    }
    if (val > 160 && val <= 180) {
      for (var item of tableData) {
        if (item.key == id) {
          item.areaInterval = '160-180m²(含)'
        }
      }
    }
    if (val > 180 && val <= 220) {
      for (var item of tableData) {
        if (item.key == id) {
          item.areaInterval = '180-220m²(含)'
        }
      }
    }
    if (220 < val) {
      for (var item of tableData) {
        if (item.key == id) {
          item.areaInterval = '220m²以上'
        }
      }
    }
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { query }
    })
  }
  // 多选改变
  function multipleChange(value, name, id) {
    for (var item of attributeList) {
      if (item.id == id) {
        item.defaultValue = value.join(',')
      }
    }
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { attributeList }
    })
  }
  function inputZituoChange(value, name) {
    newProduct = value
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { newProduct }
    })
  }
  //新增竞品品牌
  function updateCancel() {
    brandNameModal.visible = !brandNameModal.visible
    form.resetFields()
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { brandNameModal }
    })
  }
  function onSubmit() {
    if (!newProduct) {
      message.warning('请先添加竞品')
      return
    }
    let list = attributeList.filter(item => item.tableField == 'brandName')[0].itemContent.split(",")
    list.push(newProduct)
    for (var item of attributeList) {
      if (item.tableField == 'brandName') {
        item.itemContent = list.join(',')
        dispatch({
          type: `${namespace}/addlittle`,
          payload: { id: item.id, itemContent: item.itemContent }
        })
      }
    }
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { attributeList }
    })
    updateCancel()
  }

  function deleteProduct(item) {
    for (var itt of attributeList) {
      if (itt.tableField == 'relationProject') {
        let list = itt.defaultValue.split(",")
        itt.defaultValue = list.filter(el => el != item).join(',')
        selectedProject = list.filter(el => el != item).join(',')
      }
    }
    let myProject = attributeList.filter(el => el.tableField == 'relationProject')
    let list = myProject[0].defaultValue.split(",")
    for (var itt of productList) {
      for (var item of list) {
        if (itt.projectId == item.split(":")[0]) {
          itt.state = 1
        } else {
          itt.state = 0
        }
      }
    }
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { attributeList, selectedProject }
    })
  }


  function submit() {
    validateFieldsAndScroll((err) => {
      if (err) {
        return false
      } else {
        dispatch({
          type: `${namespace}/submit`,
          payload: {}
        })
      }
    })
  }
  return (
    <div className='public_listMain'>
      <div className={"functionButton"}>
        <Button disabled={actionType == 'check'} type='primary' onClick={e => submit()} loading={btnLoading}>提交</Button>
      </div>

      <CollapsiblePanels title="基本信息" hideUpDownBtn={true} >
        <Row className={styles.ziyuanWrap} gutter={16}>
          <Col span={12} className={styles.gridConter}>
            {attributeList == undefined ? null : attributeList.map((item) => {
              if (item.isRadio == '1') { //单选
                if (item.attributeName == "竞品周报录入授权项目") {
                  return (<Row key={item.id}>
                    <Col span={24}>
                      <FormItem label={item.attributeName}  {...formItemLayoutPro}>
                        {getFieldDecorator(item.id, {
                          rules: [{
                            required: item.isShow == '1' ? true : false, message: '请选择' + item.attributeName
                          }],
                          initialValue: item.defaultValue
                        })(
                          <Select disabled={actionType == 'check'} placeholder={'请选择' + item.attributeName} onChange={(e) => { inputChange(e, item.id, item.id) }}>
                            {selectedProject.split(",").map((itemd) => {
                              return <Select.Option key={itemd.split(":")[1]} value={itemd.split(":")[1]}>{itemd.split(":")[1]}</Select.Option>
                            })}
                          </Select>
                        )}
                      </FormItem>
                    </Col>
                  </Row>)
                } else {
                  return (<Row key={item.id}>
                    <Col span={24}>
                      <FormItem label={item.attributeName}  {...formItemLayoutPro}>
                        {getFieldDecorator(item.id, {
                          rules: [{
                            required: item.isShow == '1' ? true : false, message: '请选择' + item.attributeName
                          }],
                          initialValue: item.defaultValue
                        })(
                          <Select disabled={actionType == 'check'} placeholder={'请选择' + item.attributeName} onChange={(e) => { inputChange(e, item.id, item.id) }}>
                            {item.itemContent.split(",").map((itemd) => {
                              return <Select.Option key={itemd} value={itemd}>{itemd}</Select.Option>
                            })}
                          </Select>
                        )}
                      </FormItem>
                    </Col>
                  </Row>)
                }
              } else if (item.isRadio == '2') { //多选
                if (item.tableField == 'relationProject') {
                  return (<Row key={item.id} style={{ marginBottom: '12px', height: '42px' }}>
                    <Col span={6} style={{ textAlign: 'right' }}><span style={{ color: 'red' }}>*</span> {item.attributeName} :</Col>
                    <Col span={14} style={{ paddingRight: '60px' }}>
                      <div style={{ display: 'inline-block' }}>
                        {item.defaultValue.split(",").map((itemd, idx) => {
                          return (
                            itemd ?
                              <div key={idx + ''} style={{ display: 'inline-block', marginRight: '12px', background: '#d7d7d7', padding: '4px 10px', borderRadius: '20px', marginTop: '6px' }}>
                                <span style={{ marginRight: "10px" }}>{itemd.split(":")[1]}</span>
                                <span onClick={(e) => { deleteProduct(itemd) }} style={{ cursor: "pointer", color: '#fff' }}>X</span>
                              </div> : null
                          )
                        })}
                      </div>
                      <Button style={{ position: "absolute", right: 0, top: '4px', cursor: "pointer", zIndex: 99 }} type='primary' onClick={(e) => { updateProjectName(item.id) }}>关联</Button>
                    </Col>
                  </Row>)
                } else {
                  return (<Row key={item.id}>
                    <div style={{ marginLeft: '25%', color: 'red', }}>注：若在竞品品牌无法查找所需品牌，请点击添加</div>
                    <Col span={24} style={{ position: 'relative' }}>
                      <FormItem label={item.attributeName}  {...formItemLayoutPro}>
                        {getFieldDecorator(item.id, {
                          rules: [{
                            required: item.isShow == '1' ? true : false, message: '请选择' + item.attributeName
                          }],
                          initialValue: item.defaultValue ? item.defaultValue.split(",") : []
                        })(
                          <Select
                            mode="multiple"
                            optionFilterProp="children"
                            filterOption={true}
                            placeholder={"请选择" + item.attributeName}
                            onChange={(e, v) => {
                              let arr = []
                              v.map((itt) => {
                                arr.push(itt.props.value)
                              })
                              multipleChange(arr, item.id, item.id)
                            }}
                            style={{ width: '100%' }}
                          >
                            {item.itemContent.split(",").map((itemd, idx) => {
                              return (
                                itemd ?
                                  <Option key={idx + ''} value={itemd}>{itemd}</Option> : null
                              )
                            })}
                          </Select>
                        )}
                      </FormItem>
                      <Button style={{ position: "absolute", right: '16.8%', top: '4px', cursor: "pointer", zIndex: 99 }} type='primary' onClick={() => { updateCancel() }}>添加</Button>
                    </Col>
                  </Row>)
                }
              } else if (item.isRadio == '3') {//文本
                if (item.tableField == 'floorSpace' || item.tableField == 'plotRatio') {
                  return (<Row key={item.id}>
                    <Col span={24}>
                      <FormItem label={item.attributeName}  {...formItemLayoutPro}>
                        {getFieldDecorator(item.id, {
                          rules: [{
                            required: item.isShow == '1' ? true : false, message: '请输入' + item.attributeName
                          }, { pattern: /^[+-]?\d*\.?\d*$/, message: '请输入数字' }],
                          initialValue: item.defaultValue + ''
                        })(
                          <Input disabled={actionType == 'check'} placeholder={'请输入' + item.attributeName} onChange={(e) => { inputChange(e.target.value, item.id, item.id) }} />
                        )}
                      </FormItem>
                    </Col>
                  </Row>)
                } else {
                  return (<Row key={item.id}>
                    <Col span={24}>
                      <FormItem label={item.attributeName}  {...formItemLayoutPro}>
                        {getFieldDecorator(item.id, {
                          rules: [{
                            required: item.isShow == '1' ? true : false, message: '请输入' + item.attributeName
                          }],
                          initialValue: item.defaultValue + ''
                        })(
                          <Input disabled={actionType == 'check'} placeholder={'请输入' + item.attributeName} onChange={(e) => { inputChange(e.target.value, item.id, item.id) }} />
                        )}
                      </FormItem>
                    </Col>
                  </Row>)
                }
              } else if (item.isRadio == '5') { //日期
                return (<Row key={item.id}>
                  <Col span={24}>
                    <FormItem label={item.attributeName}  {...formItemLayoutPro}>
                      {getFieldDecorator(item.id, {
                        rules: [{
                          required: item.isShow == '1' ? true : false, message: '请选择' + item.attributeName
                        }],
                        initialValue: item.defaultValue ? moment(item.defaultValue, 'YYYY-MM-DD') : null
                      })(
                        <DatePicker disabled={actionType == 'check'} format="YYYY-MM-DD" onChange={(e, val) => { inputChange(val, item.id, item.id) }} />
                      )}
                    </FormItem>
                  </Col>
                </Row>)
              } else if (item.isRadio == '6') { //富文本
                return (<Row key={item.id}>
                  <Col span={24}>
                    <FormItem label={item.attributeName}  {...formItemLayoutPro}>
                      {getFieldDecorator(item.id, {
                        rules: [{
                          required: item.isShow == '1' ? true : false, message: '请输入' + item.attributeName
                        }],
                        initialValue: item.defaultValue
                      })(
                        <TextArea maxLength={500} placeholder='请输入' rows={4} onChange={(e) => { inputChange(e.target.value, item.id, item.id) }} />
                      )}
                    </FormItem>
                  </Col>
                </Row>)
              } else if (item.isRadio == '10') { //地址
                return (<Row key={item.id}>
                  <Col span={24} style={{ position: 'relative' }}>
                    <FormItem label={item.attributeName}  {...formItemLayoutPro}>
                      {getFieldDecorator(item.id, {
                        rules: [{
                          required: item.isShow == '1' ? true : false, message: '请输入' + item.attributeName
                        }],
                        initialValue: item.defaultValue
                      })(
                        <Search
                          placeholder={'请输入' + item.attributeName}
                          enterButton="搜索"
                          onSearch={(e) => { addressChange(e, item.id, item.id) }}
                        />
                      )}
                    </FormItem>
                    <div style={{ display: mapListShow ? 'block' : 'none', position: 'absolute', left: '25%', background: '#fff', zIndex: 100, width: '58.4%', padding: '10px', top: '40px', boxShadow: '0 0 2px #aaa', maxHeight: '238px', overflowY: 'scroll' }}>
                      {mapList == undefined ? null : mapList.map((el, inx) => {
                        return (
                          <div key={inx} onClick={(e) => { updateAddress(el) }} style={{ paddingBottom: '10px', borderBottom: '1px solid #eee', cursor: 'pointer' }} >
                            <div>{el.title}</div>
                            <div>{el.address}</div>
                          </div>
                        )
                      })}
                    </div>
                  </Col>
                </Row>)
              }
            })}
          </Col>
          <Col span={12} className={styles.gridConter}>
            <PredictMap
              address={address}
              actionType={actionType}
              visible={mapVisible}
              latAndLon={latAndLon}
              cbk={(v) => cbk(v)}
            />
          </Col>
        </Row>
      </CollapsiblePanels>
      <CollapsiblePanels title="竞品开盘情况" hideUpDownBtn={true} >
        <Button style={{ float: 'right', marginBottom: '16px', zIndex: '9' }} disabled={actionType == 'check'} type='primary' onClick={() => { addGridProps3() }}>新增</Button>
        {actionType != 'add' && <Button style={{ float: 'right', marginBottom: '16px', zIndex: '9', marginRight: '10px' }} type='primary' onClick={() => { downloadProps3(downId) }}>导出</Button>}
        <div className={'mt1', 'table_projectList'}>
          <Form>
            <Grid {...gridProps3} />
          </Form>
        </div>
      </CollapsiblePanels>
      <CollapsiblePanels title="竞品产品信息" hideUpDownBtn={true} >
        <Button style={{ float: 'right', marginBottom: '16px', zIndex: '9' }} disabled={actionType == 'check'} type='primary' onClick={() => { addTableRow() }}>新增</Button>
        <div className={'mt1', 'table_projectList'}>
          <Form>
            <Grid {...gridProps} />
          </Form>
        </div>
      </CollapsiblePanels>
      <CollapsiblePanels title="竞品累计成交" hideUpDownBtn={true} >
        <div className={'mt1', 'table_projectList'}>
          <Form>
            <Grid {...gridProps1} />
          </Form>
        </div>
      </CollapsiblePanels>
      <Modal
        title={'我司项目明细'}
        width='1200px'
        visible={pModalObj.visible}
        destroyOnClose={true}
        onCancel={() => { updateProjectName() }}
        onOk={() => { confirmBuyHouse() }}
      >
        <div>
          <AdvanceSearch
            footer={
              <span>
                <Button type="primary" htmlType="submit" onClick={() => onSearch()} loading={loading}>搜索</Button>
                <Button onClick={() => dispatch({ type: `${namespace}/queryReset` })}>重置</Button>
              </span>
            }
          >
            <QueryCondition
              data={queryList}
              inputChange={(key, value) => dispatch({ type: `${namespace}/inputChange`, payload: { key, value } })}
            />
          </AdvanceSearch>
          <Grid {...gridProps2} />
        </div>
      </Modal>
      <Modal
        title="新增竞品品牌"
        width='600px'
        visible={brandNameModal.visible}
        onOk={() => { onSubmit() }}
        onCancel={() => { updateCancel() }}
      >
        <Row>
          <Col span={24}>
            <FormItem label='竞品品牌' extra={"注：若在竞品品牌无法查找所需品牌，请在此新增"}  {...formItemLayoutPro}>
              {getFieldDecorator('brandName', {
                rules: [{
                  required: false, message: '请输入竞品品牌'
                }],
                initialValue: query.brandName
              })(
                <Input placeholder='请输入竞品品牌' onChange={(e) => { inputZituoChange(e.target.value, 'brandName') }} />
              )}
            </FormItem>
          </Col>
        </Row>
      </Modal>
      <Modal
        title="预览"
        visible={imgModal.visible}
        width='900px'
        footer={false}
        onCancel={() => { upimgCancel() }}
      >
        <img style={{ width: '850px', }} src={url} alt="" />
      </Modal>
    </div>
  )
}

// 连接视图(view)和模型(model)
export default connect(mapStateToProps)(Form.create()(competingGoodsDetailView))
